<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator"
	prefix="decorator"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<decorator:usePage id="mainPage" />
<html>
<head>
<link href="<s:url value='/css/not-ie.css' />" rel="stylesheet"
	type="text/css">
<script language="javascript" src="<s:url value='/js/control.js' />"></script>
<script language="javascript"
	src="<s:url value='/js/jquery-1.7.1.min.js' />"></script>
<script language="javascript">
	function sf() {
		new NumberControl();
		if (jQuery("[name='page']").val() == "view") {
			document.getElementById("btnCancel").focus();
		} else {
			document.getElementsByName("user.name")[0].focus();
		}
	}
	function savePage() {
		frm = document.userAddForm;
		if (!validate('userAddForm', '<s:text name="0003" />')) {
			return false;
		}

		if (jQuery("[name='page']").val() == "add") {
			frm.action = "<s:url value='/jsp/user/addUser.action'/>";
		} else {
			frm.action = "<s:url value='/jsp/user/editUser.action'/>";
		}
		frm.submit();

	}
	function validate(formId, msg) {
		var eles = jQuery("#" + formId + " .requireInput");
		for ( var i = 0; i < eles.length; i++) {
			if (!eles[i].disabled && eles[i].value == '') {
				alert(msg);
				eles[i].focus();
				return false;
			}
		}
		return true;
	}
	function gotoSearch() {
		frm = document.userAddForm;
		if (frm["criteriaKey"].value == "") {
			frm.action = "<s:url value='/initUser.action'/>";
			frm.submit();
		} else {
			frm.action = "<s:url value='/searchUser.action'/>";
			frm.submit();
		}
	}
	function checkID(id) {
		if (id.length != 13)
			return false;
		for (i = 0, sum = 0; i < 12; i++)
			sum += parseFloat(id.charAt(i)) * (13 - i);
		if ((11 - sum % 11) % 10 != parseFloat(id.charAt(12)))
			return false;
		return true;
	}

	function checkForm(id) {
		if (!checkID(id)){
			alert('รหัสประชาชนไม่ถูกต้อง');
		    document.getElementsByName("criteria.peopleId").value = "";
		}else{
			alert('รหัสประชาชนถูกต้อง เชิญผ่านได้');
		}
	}
</script>
<style type="text/css">
.tab-bar {
	width: 100%;
	height: 100px;
	overflow: hidden;
}

.tab-body {
	float: left;
	width: 100%;
	vertical-align: top;
	overflow: hidden;
}
</style>
</head>

<body onload="javascript:sf();">
	<s:if test="page=='add'">
		<h1>เพิ่มผู้ใช้</h1>
	</s:if>
	<s:elseif test="page=='edit'">
		<h1>แก้ไขข้อมูลผู้ใช้</h1>
	</s:elseif>
	<s:else>
		<h1>แสดงข้อมูลผู้ใช้</h1>
	</s:else>
	<s:form id="userAddForm" onsubmit="return savePage();" method="post"
		theme="simple" name="userAddForm" cssClass="margin-zero">
		<table class="authen">
			<tr>
				<td class="left"></td>
				<td class="center"><s:property value="#request.message" /></td>
				<td class="right"></td>
			</tr>
		</table>
		<table class="form">
			<tr style="height: 0px;">
				<td class="col-width-100px"></td>
				<td class="col-width-175px"></td>
				<td class="col-width-175px"></td>
				<td class="col-width-125px"></td>
				<td class="col-width-175px"></td>
				<td class="col-width-auto"></td>
			</tr>

			<tr>
				<td></td>
			</tr>

			<tr>
				<td></td>
				<td align="right">ชื่อ&nbsp;<font color="red">*</font>&nbsp;
				</td>
				<td><s:textfield name="user.name" cssClass="requireInput"
						disabled="%{page=='view'}" /></td>
				<td align="right">นามสกุล&nbsp;<font color="red">*</font>&nbsp;
				</td>
				<td><s:textfield name="user.surName" cssClass="requireInput"
						disabled="%{page=='view'}" /></td>
			</tr>
			<tr>
				<td></td>
				<td align="right">เลขประจำตัวบัตรประชาชน&nbsp;<font color="red">*</font>&nbsp;
				</td>
				<td><s:textfield name="user.peopleId"
						cssClass="requireInput input_number" maxlength="13"
						disabled="%{page=='view'}" onchange="checkForm(this.value)"/></td>
				<td align="right">โทรศัพท์มือถือ&nbsp;&nbsp;&nbsp;&nbsp;</td>
				<td><s:textfield name="user.mobile" maxlength="10"
						cssClass="input_number" disabled="%{page=='view'}" /></td>
			</tr>
			<tr>
				<td></td>
				<td align="right">โทรศัพท์บ้าน&nbsp;&nbsp;&nbsp;&nbsp;</td>
				<td><s:textfield name="user.phone" maxlength="10"
						cssClass="input_number" disabled="%{page=='view'}" /></td>
				<td align="right">ชื่อผู้ใช้&nbsp;<font color="red">*</font>&nbsp;
				</td>
				<td><s:textfield name="user.userName" cssClass="requireInput"
						disabled="%{page=='view'}" /></td>
			</tr>
			<tr>
				<td></td>
				<td align="right">รหัสผู้ใช้&nbsp;<font color="red">*</font>&nbsp;
				</td>
				<td><s:textfield name="user.password" cssClass="requireInput"
						disabled="%{page=='view'}" /></td>

			</tr>
			<tr>
				<td></td>
				<td align="right">ที่อยู่&nbsp;<font color="red">*</font>&nbsp;
				</td>
				<td colspan="3"><s:textarea name="user.address"
						cssClass="requireInput" cssStyle="width:92%"
						disabled="%{page=='view'}" /></td>

			</tr>
			<tr>
				<td></td>
				<s:if test="page != 'add'">
					<td align="right">ใช้งาน&nbsp;&nbsp;&nbsp;&nbsp;</td>
					<td><s:checkbox name="user.status" disabled="%{page=='view'}" /></td>
				</s:if>
			</tr>
		</table>

		<table class="button">
			<tr>
				<td class="left"></td>
				<td class="right"><s:if test="page=='add'">
						<input type="button" id="btnSave" onclick="savePage();"
							value="<s:text name="save"></s:text>" />
					</s:if> <s:elseif test="page=='edit'">
						<input type="button" id="btnSave" onclick="savePage();"
							value="<s:text name="edit"></s:text>" />
					</s:elseif> <input type="button" id="btnCancel" onclick="gotoSearch();"
					value="<s:text name="cancle"></s:text>" /></td>
			</tr>
		</table>
		<s:hidden name="criteriaKey" />
		<s:hidden name="page" />
		<s:hidden name="user.userId" />
		<s:token />
	</s:form>
</body>
</html>